<template>
<!--	<el-container>-->
<!--	</el-container>-->
	<el-container style="overflow: hidden;">
<!--		<el-main class="nopadding">-->
<!--			<div id="clock">-->
<!--				<div style="background-color: #409eff;">-->
<!--					<p class="date">{{ date }}</p>-->
<!--					<p class="time">{{ time }}</p>-->
<!--				</div>-->
<!--			</div>-->
<!--		</el-main>-->
		<el-container style="margin-right: 15px;overflow: hidden;">
            <!-- <el-header class="header-tabs">
                <el-tabs type="card" v-model="groupId" @tab-change="tabChange">
                    <el-tab-pane label="空间规划" name="dept"  tabActiveName="dept"></el-tab-pane>
                    <el-tab-pane label="查看数据" name="type"></el-tab-pane>
                </el-tabs>
            </el-header> -->
			<el-scrollbar style="margin-top: 5px;">
				<div :style="{height: rowHeight + 'px'}" ref="row" style="border: 1px solid transparent;">
					<dept v-if="groupId=='dept'" />
					<type v-if="groupId=='type'"/>
				</div>
			</el-scrollbar>
			<el-footer></el-footer>
        </el-container>
	</el-container>
</template>

<script>
import dept from './components/dept'
import type from './components/type'
export default {
	name: 'industryIntelligent',
	components: {
		dept,
		type
	},
	data() {
		return {
			groupId:"dept",
			isComponent:"dept",
			rowHeight:""
		}
	},
	mounted(){
		this.getRowdom()
	},
	methods: {
		tabChange(name){
			this.isComponent = name;
		},
		getRowdom(){
			let rowDom=this.$refs.row
			this.rowHeight=window.innerHeight-rowDom.getBoundingClientRect().top
			this.rowHeight=this.rowHeight-51
   	 	},
	}
}
</script>

<style scoped lang="scss">
    .header-tabs{
        padding-top: 15px;
    }
    :deep(.header-tabs .el-tabs__header){
        // border-right: 1px solid var(--el-border-color-light);
		padding-left:0;
		background-color:#fff;

    }
    // :deep(.el-tabs--card>.el-tabs__header .el-tabs__nav),:deep(.el-container + .el-aside){
    //     border: unset;
    // }
	:deep(.el-tabs--card>.el-tabs__header .el-tabs__nav){
		border-left: unset;
	}
	:deep(.el-container + .el-aside){
        border: unset;
    }
</style>
